<!--测试级联属性，禁止a标签的默认行为和事件冒泡-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试级联属性，禁止a标签的默认行为和事件冒泡</title>
    <script type="text/javascript" src="../js/vue.js"></script>
</head>
<body>
    <div id="cascade">
        <div v-on:click="showMaker">
            <!--此时阻止了a标签的默认行为和事件冒泡到div上，所以事件target只输出一次-->
            <a href="http://www.atguigu.com"  v-on:click.prevent.stop="showMaker">点击跳转到尚硅谷</a> 
        </div>
    </div>
    <script type="text/javascript">
        new Vue({
           el: '#cascade',
           data:function(){
            return {

            }
           },
           methods:{
             showMaker(event){
                console.log(event.target)
             }
           }
        })
    </script>
     
</body>
</html>